{% extends 'base.html' %}

{% block link %}
    <link href="https://unpkg.com/@wangeditor/editor@latest/dist/css/style.css" rel="stylesheet">
    <script src="https://unpkg.com/@wangeditor/editor@latest/dist/index.js"></script>
    <link rel="stylesheet" href="../../static/css/sub_article.css">
    <style>


    </style>
{% endblock %}


<title>{% block title %}
    文章发布
{% endblock %}</title>
{% block content %}
    <div class="container">
        <div class="row" style="margin-top: 20px;">
            <div class="col"></div>
            <div class="col-10">
                {#                <h1 style="text-align: center;">发布文章</h1>#}
                <form action="#" id="myform" method="post" enctype="multipart/form-data">
                    <div id="toolbar-container">
                        <!-- 工具栏 -->
                    </div>
                    <div id="editor—wrapper">
                        <div>
                            <input type="text" name="title"
                                   style="width: 100%; height: 50px;text-align: center;border: 0 solid whitesmoke;font-size: 30px"
                                   placeholder="请输入标题">
                            <hr>
                            <div id="editor-container">
                                <!-- 编辑器 -->
                            </div>
                        </div>
                        <textarea id="text" name="content"  hidden></textarea>
                    </div>

                    <div class="article-detail">
                        <div class="article-detail-place">
                            <div class="label">
                                <span>文章分类</span>
                                <select class="custom-select custom-select-lg mb-3 category-select" name="category">
                                    <option selected>请选择分类</option>
                                    {% for cat in category %}
                                        <option value={{ cat.id }}>{{ cat.name }}</option>

                                    {% endfor %}


                                </select>
                                <p id="error_category"></p>
                            </div>
                            <div class="credit">
                                <span>所需积分</span>
                                <div class="form-group user_credit">
                                    <input type="text" class="form-control " name="use_credit">
                                </div>
                                <p id="error_credit" style="color: red"></p>


                            </div>
                            <div class="label">
                                <span>是否隐藏</span>
                                <select class="custom-select custom-select-lg mb-3 category-select" name="hidden">
                                    <option selected>请选择</option>
                                    <option value=1>是</option>
                                    <option value=0>否</option>
                                </select>
                            </div>
                            <div class="cover">
                                <span>添加封面</span>
                                <div style="display: inline-block;position: relative;">
                                    <div style="display:inline-block;">
                                        <div class="custom-file">

                                            <input type="file" id="file-input" name="files"/>
                                            <label for="file-input" id="custom-file-label"><img
                                                    src="../../static/icon/上传文件.svg" alt=""></label>

                                        </div>
                                    </div>
                                    <div class="file-show"></div>
                                </div>


                            </div>
                            <div class="detail">
                                <span style="position: relative;bottom: 25px">文章摘要</span>
                                <label for="">
                                    <textarea type="text" id="detail" name="detail"></textarea>
                                </label>
                                <p id="error_detail" style="color: red"></p>
                            </div>
                            <div class="form-group submit">
                                <button class="btn btn-primary" disabled>保存</button>
                                <button class="btn btn-success sub-article" type="submit">发布</button>
                            </div>
                        </div>

                    </div>
                </form>
            </div>
            <div class="col"></div>
        </div>
    </div>
{% endblock %}

{% block bottom %}
    <script src="../../static/js/article/sub_article.js"></script>
    <script src="../../static/js/article/myediter.js"></script>

{% endblock %}

